<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>慧题通-个人中心</title>
</head>
<body>
<el-menu
        id="menu"
        default-active="0"
        class="el-menu-vertical-demo"
        style="width: 135px;float: left"
>
    <el-menu-item index="0">
        <i class="el-icon-help"></i>
        <span slot="title">主页</span>
    </el-menu-item>
    <el-menu-item index="1" @click="toMyQuestion">
        <i class="el-icon-location"></i>
        <span slot="title">我的题目</span>
    </el-menu-item>
    <el-menu-item index="2" @click="toAllQuestion">
        <i class="el-icon-menu"></i>
        <span slot="title">全站题目</span>
    </el-menu-item>
    <el-menu-item index="3" @click="toDoQuestion">
        <i class="el-icon-setting"></i>
        <span slot="title">练习题目</span>
    </el-menu-item>
    <el-menu-item index="4" @click="toAddQuestion">
        <i class="el-icon-document"></i>
        <span slot="title">添加题目</span>
    </el-menu-item>
</el-menu>

<div id="app" v-loading="loading" style="overflow: scroll;height: 100%">
    <el-page-header @back="goBack" content="个人中心">
    </el-page-header>
    <el-card
            v-loading="loadingSetting"
            shadow="hover"
            body-style="padding: 5px; margin: 0px;margin-left: 10px;margin-right: 10px"
            style="margin: 25px 25px 25px 25px;width: 35vw">
        <el-row style="margin-top: 10px">
            <span>个人设置</span>
        </el-row>
        <el-divider style="padding-top: 5px"></el-divider>
        <el-form :label-position="'left'" label-width="60px">
            <el-form-item label="昵称">
                <span v-if="!editing">{{user.nickname}}</span>
                <el-input v-if="editing" v-model="user.nickname" placeholder="请输入昵称"
                          style="width: 200px"></el-input>
            </el-form-item>
        </el-form>
        <el-row>
            <el-col :span="4" style="float: right">
                <el-button v-if="!editing" type="text" @click="editUserInfo">修改
                </el-button>
                <el-button v-if="editing" type="text" @click="saveUserInfo">保存
                </el-button>
                <el-button v-if="editing" type="text" @click="cancelSaveUserInfo">取消
                </el-button>
            </el-col>
        </el-row>
    </el-card>

    <el-card
            shadow="hover"
            body-style="padding: 5px; margin: 0px;margin-left: 10px;margin-right: 10px"
            style="margin: 25px 25px 25px 25px;width: 35vw">
        <el-row style="margin-top: 10px">
            <span>我的信息</span>
        </el-row>
        <el-divider style="padding-top: 5px"></el-divider>
        <el-form :label-position="'left'" label-width="60px">
            <el-form-item label="邮箱">
                <span>{{user.mail}}</span>
            </el-form-item>
            <el-form-item label="id">
                <span>{{user.id}}</span>
            </el-form-item>
        </el-form>
    </el-card>
</div>

</body>

<script src="../../js/vue.js"></script>
<script src="../../js/axios-0.18.0.js"></script>
<script type="text/javascript" src="../../js/jquery.min.js"></script>
<script src="../../plugins/element-ui/lib/index.js"></script>
<link rel="stylesheet" href="../../plugins/element-ui/lib/theme-chalk/index.css">

<link rel="stylesheet" href="../../css/main.css">

<script src="../../js/common.js"></script>
<script src="../../js/menu.js"></script>
<script src="../../js/me.js"></script>

</html>